<!DOCTYPE html>
<html>

    <head>
        <meta charset="utf-8">
        <title>搜索引擎</title>
        <link href="//cdn.bootcss.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
    </head>

    <body>
        <div class="container">
            <!-- 首页 -->
            <div class="row text-center" style="margin-top: 100px;">
                <img src="img/Search.png" style="height: 200px; margin-bottom:30px; "/>
                <div class="input-group col-xs-8 col-xs-offset-2">
                    <input id="searchText" type="text" class="form-control" placeholder="搜索关键字" onkeypress="if(event.keyCode == 13) EsSearch();">
                    <span class="input-group-btn">
                        <button class="btn btn-primary" style="width: 100px;" onclick="EsSearch();">搜索一下</button>
                    </span>
                </div>
            </div>
            <div class="row text-center">
            	<br>
				<table class="table" style="width:780px; margin:auto">
					<tbody>
						<tr>
							<td colspan="3" class="text-left">新闻热词</td>
						</tr>
					</tbody>
				</table>
            </div>
        </div>
        <script src="//cdn.bootcss.com/jquery/1.12.0/jquery.min.js"></script>
        <script src="//cdn.bootcss.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
        <script type="text/javascript">
            function EsSearch(){
                var searchText = $("#searchText").val();
                //alert(searchText);
                window.location.href = "detail.html?searchText=" + searchText;
            }
            $(function(){
            	$.ajax({
            		url : "/view/getKeyword",
                    type : "GET",
                    success : function(data){
                    	console.log(data);
                    	var t = data.length % 3;
                    	for(var i=0; i < data.length - t; i++) {
                    		if(i % 3 == 0) {
                    			$('tbody').append('<tr>');
                    		}
                    		$('tbody').append('<td class="table-bordered"><a class="hot" href="detail.html?searchText=' + data[i] + '">' + data[i] + '</a></td>');
                    		if(i % 3 == 0) {
                    			$('tbody').append('</tr>');
                    		}
                    	}
                    	$('.hot').on('click',function(){
                    		
                    	});
                    }
            	});
            });
        </script>
    </body>

</html>